<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>taobao</title>

    <link href="css/main.css" rel="stylesheet">
    <link href="css/animate.css" rel="stylesheet">
    <link href="css/footer.css" rel="stylesheet">
    <link href="css/header.css" rel="stylesheet">
    <link href="css/page1.css" rel="stylesheet">
    <link href="css/page2.css" rel="stylesheet">
    <link href="css/page3.css" rel="stylesheet">
    <link href="css/page4.css" rel="stylesheet">
</head>
<body>
<input checked id="home" name="ground" type="radio">
<input id="chat" name="ground" type="radio">
<input id="shopping-car" name="ground" type="radio">
<input id="user" name="ground" type="radio">
<div class="main-container">
    <div class="main-page-window">
        <div class="page-home">
            <div class="header-container">
                <div class="search-container">
                    <div class="scan-code" tabindex="9">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M6 15V6H15" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="2"/>
                            <path d="M15 42H6V33" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="2"/>
                            <path d="M42 33V42H33" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="2"/>
                            <path d="M33 6H42V15" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="2"/>
                            <path d="M10 24H38" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="2"/>
                        </svg>
                    </div>
                    <span>|</span>
                    <input type="text">
                    <?xml version="1.0" encoding="UTF-8"?>
                    <div class="camera" tabindex="10">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M15 12L18 6H30L33 12H15Z" fill="none" stroke="#888888" stroke-linejoin="round"
                                  stroke-width="2"/>
                            <rect fill="none" height="30" rx="3" stroke="#888888" stroke-linejoin="round"
                                  stroke-width="2"
                                  width="40" x="4"
                                  y="12"/>
                            <path d="M24 35C28.4183 35 32 31.4183 32 27C32 22.5817 28.4183 19 24 19C19.5817 19 16 22.5817 16 27C16 31.4183 19.5817 35 24 35Z"
                                  fill="none" stroke="#888888" stroke-linejoin="round" stroke-width="2"/>
                        </svg>
                    </div>
                    <button class="bt-submit">搜索</button>
                </div>
            </div>
            <div class="pilot-card-container">
                <div class="pilot-card">
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z"
                                  stroke="#333" stroke-width="4"/>
                            <path d="M4 20.8404C7.01485 19.4168 9.24466 19.2185 10.6894 20.2454C12.8566 21.7859 13.1283 28.064 18.0575 25.0635C22.9867 22.063 15.9467 20.8404 17.475 16.4939C19.0033 12.1474 24.0083 15.5237 24.5059 10.7627C24.8375 7.58862 21.0408 6.37413 13.1156 7.11921"
                                  stroke="#333" stroke-width="4"/>
                            <path d="M36.0001 8C30.2857 12.9886 28.2899 16.0011 30.0127 17.0373C32.5968 18.5917 33.6933 16.4033 36.8467 17.0373C40.0001 17.6714 39.3173 21.9457 37.6587 21.9457C36.0001 21.9457 27.41 20.8518 27.8427 25.865C28.2753 30.8781 33.4422 31.6203 33.4422 34.4211C33.4422 36.2883 32.299 39.146 30.0127 42.9942"
                                  stroke="#333" stroke-linecap="round" stroke-width="4"/>
                            <path d="M6.10449 32.9264C7.01598 32.5288 7.70115 32.2374 8.15999 32.052C12.0071 30.4978 14.8617 30.1314 16.7236 30.953C20.0161 32.4059 18.7503 35.3401 19.7816 36.4211C20.8128 37.5021 23.388 37.1876 23.388 39.244C23.388 40.615 22.9275 42.1637 22.0065 43.8901"
                                  stroke="#333" stroke-linecap="round" stroke-width="4"/>
                        </svg>
                        <span>世界</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M40 30V15L27.5 7.96875M20.5 7.96875L8 15V30M11 34.6875L24 42L32 37.5L37 34.6875"
                                  stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M21 18.75L18 20.5V24V27.5L21 29.25L24 31L27 29.25L30 27.5V24V20.5L27 18.75L24 17L21 18.75Z"
                                  fill="none" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 17V10" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M30 27L37 31" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 27L11 31" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <circle cx="24" cy="7" fill="none" r="3" stroke="#333" stroke-linecap="round"
                                    stroke-linejoin="round" stroke-width="4"/>
                            <circle cx="8" cy="33" fill="none" r="3" stroke="#333" stroke-linecap="round"
                                    stroke-linejoin="round" stroke-width="4"/>
                            <circle cx="40" cy="33" fill="none" r="3" stroke="#333" stroke-linecap="round"
                                    stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>区块链</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M4 19.313V9H44V19.313C41.8815 20.068 40.3636 22.1053 40.3636 24.5C40.3636 26.8947 41.8815 28.932 44 29.687V40H4V29.687C6.11853 28.932 7.63636 26.8947 7.63636 24.5C7.63636 22.1053 6.11853 20.068 4 19.313Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M19 16L24 21L29 16" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 22H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 28.1667H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 22V34" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>优惠券</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M4 19.313V9H44V19.313C41.8815 20.068 40.3636 22.1053 40.3636 24.5C40.3636 26.8947 41.8815 28.932 44 29.687V40H4V29.687C6.11853 28.932 7.63636 26.8947 7.63636 24.5C7.63636 22.1053 6.11853 20.068 4 19.313Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M19 16L24 21L29 16" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 22H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 28.1667H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 22V34" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>优惠券</span>
                    </div>

                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M24 44C32.8366 44 40 37.4876 40 29.4545C40 21.5758 34.6667 13.0909 24 4C13.3333 13.0909 8 21.5758 8 29.4545C8 37.4878 15.1634 44 24 44Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M18.8572 19L24 24.3684L29.1429 19" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M18 26.158H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 31.5264H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 26.158V36.0001" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>水费</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M39 6H9C7.34315 6 6 7.34315 6 9V39C6 40.6569 7.34315 42 9 42H39C40.6569 42 42 40.6569 42 39V9C42 7.34315 40.6569 6 39 6Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M13.4398 29.8347L19.0967 24.1778L23.4847 28.5555L34 18.0001" stroke="#333"
                                  stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M26 18H34V26" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>趋势</span>
                    </div>

                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M31 4H16L10 27H18L14 44L40 16H28L31 4Z" fill="none" stroke="#333"
                                  stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M21 11L19 19" stroke="#333" stroke-linecap="round" stroke-width="4"/>
                        </svg>
                        <span>闪付</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M41 44V20H7V44H41Z" fill="none" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M24 44V20" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M41 44H7" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <rect fill="none" height="8" stroke="#333" stroke-linejoin="round" stroke-width="4"
                                  width="40" x="4"
                                  y="12"/>
                            <path d="M16 4L24 12L32 4" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>礼物</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M41 44V20H7V44H41Z" fill="none" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M24 44V20" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M41 44H7" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <rect fill="none" height="8" stroke="#333" stroke-linejoin="round" stroke-width="4"
                                  width="40" x="4"
                                  y="12"/>
                            <path d="M16 4L24 12L32 4" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>礼物</span>
                    </div>
                </div>

            </div>
            <div class="miaosha-container">
                <div class="miaosha-item">ss</div>
                <div class="miaosha-item">ss</div>
                <div class="miaosha-item">ss</div>
            </div>
            <div class="recommend-container">
                <div class="recommend-left">!</div>
                <div class="recommend-right">
                    <div class="recommend-item">d</div>
                    <div class="recommend-item">d</div>
                </div>
            </div>
            <div class="goods-container">商品</div>
        </div>
        <div class="page-chat">
            <div class="chat-header-container">
                <h2>消息</h2>
                <h3>(4)</h3>
                <div class="chat-header-clean">
                    清除未读
                </div>
                <?xml version="1.0" encoding="UTF-8"?>
                <svg fill="none" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
                    <path d="M21 38C30.3888 38 38 30.3888 38 21C38 11.6112 30.3888 4 21 4C11.6112 4 4 11.6112 4 21C4 30.3888 11.6112 38 21 38Z"
                          fill="none" stroke="#333" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M26.657 14.3431C25.2093 12.8954 23.2093 12 21.0001 12C18.791 12 16.791 12.8954 15.3433 14.3431"
                          stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M33.2216 33.2217L41.7069 41.707" stroke="#333" stroke-linecap="round"
                          stroke-linejoin="round"
                          stroke-width="3"/>
                </svg>
                <?xml version="1.0" encoding="UTF-8"?>
                <svg fill="none" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
                    <path d="M8 36V44H40V4H8V12" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                          stroke-width="3"/>
                    <path d="M6 30H10" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M6 24H10" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M6 18H10" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
                    <circle cx="24" cy="17" fill="none" r="4" stroke="#333" stroke-linecap="round"
                            stroke-linejoin="round"
                            stroke-width="3"/>
                    <path d="M32 35C32 30.5817 28.4183 27 24 27C19.5817 27 16 30.5817 16 35" stroke="#333"
                          stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
                </svg>
                <?xml version="1.0" encoding="UTF-8"?>
                <svg fill="none" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
                    <path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z"
                          fill="none" stroke="#333" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M24 16V32" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M16 24L32 24" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                          stroke-width="3"/>
                </svg>
            </div>
            <div class="chat-content-container">
                <div class="chat-msg-item">
                    <img alt="" src="public/mi.jpg" srcset="">
                    <div class="chat-msg-item-content-box">
                        <div class="chat-msg-item-title-box">
                            <div class="chat-msg-item-title">
                                小米之家
                            </div>
                            <div class="chat-msg-item-time">
                                24/05/24
                            </div>
                        </div>
                        <div class="chat-msg-item-content">
                            推荐看看下面几款哦
                        </div>
                    </div>
                </div>
                <div class="chat-msg-item">
                    <img alt="" src="public/mi.jpg" srcset="">
                    <div class="chat-msg-item-content-box">
                        <div class="chat-msg-item-title-box">
                            <div class="chat-msg-item-title">
                                小米之家
                            </div>
                            <div class="chat-msg-item-time">
                                24/05/24
                            </div>
                        </div>
                        <div class="chat-msg-item-content">
                            推荐看看下面几款哦
                        </div>
                    </div>
                </div>
                <div class="chat-msg-item">
                    <img alt="" src="public/mi.jpg" srcset="">
                    <div class="chat-msg-item-content-box">
                        <div class="chat-msg-item-title-box">
                            <div class="chat-msg-item-title">
                                小米之家
                            </div>
                            <div class="chat-msg-item-time">
                                24/05/24
                            </div>
                        </div>
                        <div class="chat-msg-item-content">
                            推荐看看下面几款哦
                        </div>
                    </div>
                </div>
                <div class="chat-msg-item">
                    <img alt="" src="public/mi.jpg" srcset="">
                    <div class="chat-msg-item-content-box">
                        <div class="chat-msg-item-title-box">
                            <div class="chat-msg-item-title">
                                小米之家
                            </div>
                            <div class="chat-msg-item-time">
                                24/05/24
                            </div>
                        </div>
                        <div class="chat-msg-item-content">
                            推荐看看下面几款哦
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="page-car">
            <div class="car-header-container">
                <h2>购物车</h2>
                <h3>(4)</h3>
                <div class="car-header-position">
                    广东财经大学华商学院
                </div>
                <?xml version="1.0" encoding="UTF-8"?>
                <svg fill="none" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
                    <path d="M21 38C30.3888 38 38 30.3888 38 21C38 11.6112 30.3888 4 21 4C11.6112 4 4 11.6112 4 21C4 30.3888 11.6112 38 21 38Z"
                          fill="none" stroke="#333" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M26.657 14.3431C25.2093 12.8954 23.2093 12 21.0001 12C18.791 12 16.791 12.8954 15.3433 14.3431"
                          stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
                    <path d="M33.2216 33.2217L41.7069 41.707" stroke="#333" stroke-linecap="round"
                          stroke-linejoin="round"
                          stroke-width="3"/>
                </svg>
            </div>
            <div class="car-content-container">
                <div class="car-content-item">
                    <input name="car-goods" readonly="readonly" type="checkbox">
                    <img alt="" src="public/goods1.avif" srcset="">

                    <div class="car-content-item-box">
                        <div class="car-content-item-title">
                            煲仔饭
                        </div>
                        <div class="car-content-item-option">
                            (店长推荐)广式煲仔饭 ≻
                        </div>
                        <div class="car-content-item-tips">
                            <div class="car-content-item-tips-item">
                                7天无理由退货
                            </div>
                            <div class="car-content-item-tips-item">
                                急速退款
                            </div>
                        </div>
                        <div class="car-content-item-price">
                            <h5>¥</h5>
                            <h2>250</h2>
                        </div>
                    </div>
                </div>
            </div>

        </div>
        <div class="page-user">
            <div class="user-header-container">
                <div class="user-header-left-box">
                    <img alt="" class="user-header-cover" src="public/cover.JPG" srcset="">
                    <div class="user-header-nickname">
                        <h3>maotao</h3>
                        <div class="user-header-address">
                            <span>收货地址 ></span>
                        </div>
                    </div>
                </div>
                <div class="user-header-right-box">
                    <div class="user-header-right-icon-box">

                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M36 32C40.4183 32 44 28.4183 44 24C44 19.5817 40.4183 16 36 16" fill="none"/>
                            <path d="M36 32V32C40.4183 32 44 28.4183 44 24C44 19.5817 40.4183 16 36 16" stroke="#333"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M12 16C7.58172 16 4 19.5817 4 24C4 28.4183 7.58172 32 12 32" fill="none"/>
                            <path d="M12 16C7.58172 16 4 19.5817 4 24C4 28.4183 7.58172 32 12 32V32" stroke="#333"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M12 32V31.5V29V24V16C12 9.37258 17.3726 4 24 4C30.6274 4 36 9.37258 36 16V32C36 38.6274 30.6274 44 24 44"
                                  stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>在线客服</span>
                    </div>
                    <div class="user-header-right-icon-box">

                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M34.0003 41L44 24L34.0003 7H14.0002L4 24L14.0002 41H34.0003Z" fill="none"
                                  stroke="#333"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M24 29C26.7614 29 29 26.7614 29 24C29 21.2386 26.7614 19 24 19C21.2386 19 19 21.2386 19 24C19 26.7614 21.2386 29 24 29Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>设置</span>
                    </div>
                </div>
            </div>
            <div class="user-content-container">
                <div class="user-content-header">
                    <div class="user-content-header-icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M23.9986 5L17.8856 17.4776L4 19.4911L14.0589 29.3251L11.6544 43L23.9986 36.4192L36.3454 43L33.9586 29.3251L44 19.4911L30.1913 17.4776L23.9986 5Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>收藏</span>
                    </div>
                    <div class="user-content-header-icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M40.0391 22V42H8.03906V22" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M5.84231 13.7766C4.31276 17.7377 7.26307 22 11.5092 22C14.8229 22 17.5276 19.3137 17.5276 16C17.5276 19.3137 20.2139 22 23.5276 22H24.546C27.8597 22 30.546 19.3137 30.546 16C30.546 19.3137 33.2518 22 36.5655 22C40.8139 22 43.767 17.7352 42.2362 13.7723L39.2337 6H8.84523L5.84231 13.7766Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>关注店铺</span>
                    </div>
                    <div class="user-content-header-icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M5.81836 6.72729V14H13.0911" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M4 24C4 35.0457 12.9543 44 24 44V44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C16.598 4 10.1351 8.02111 6.67677 13.9981"
                                  stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M24.005 12L24.0038 24.0088L32.4832 32.4882" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>历史</span>
                    </div>
                    <div class="user-content-header-icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path clip-rule="evenodd" d="M17.982 11.9689L31.7846 4L36.397 11.9889L17.982 11.9689Z"
                                  fill-rule="evenodd" stroke="#333"
                                  stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M4 14C4 12.8954 4.89543 12 6 12H42C43.1046 12 44 12.8954 44 14V42C44 43.1046 43.1046 44 42 44H6C4.89543 44 4 43.1046 4 42V14Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M35.25 33H44V23H35.25C32.3505 23 30 25.2386 30 28C30 30.7614 32.3505 33 35.25 33Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M44 16.5V40.5" stroke="#333" stroke-linecap="round" stroke-width="4"/>
                        </svg>
                        <span>钱包</span>
                    </div>
                </div>
                <div class="card">
                    <div class="card-label">
                        <span>我的订单</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M4 10C4 8.89543 4.89543 8 6 8H42C43.1046 8 44 8.89543 44 10V38C44 39.1046 43.1046 40 42 40H6C4.89543 40 4 39.1046 4 38V10Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M4 16H44" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M27 32H36" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M44 10V26" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M4 10V26" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>待付款</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path clip-rule="evenodd" d="M6 15H42L40 42H8L6 15Z" fill="none" fill-rule="evenodd"
                                  stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M16 19V6H32V19" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M16 34H32" stroke="#333" stroke-linecap="round" stroke-width="4"/>
                        </svg>
                        <span>待发货</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M12 39C14.2091 39 16 37.2091 16 35C16 32.7909 14.2091 31 12 31C9.79086 31 8 32.7909 8 35C8 37.2091 9.79086 39 12 39Z"
                                  stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M35 39C37.2091 39 39 37.2091 39 35C39 32.7909 37.2091 31 35 31C32.7909 31 31 32.7909 31 35C31 37.2091 32.7909 39 35 39Z"
                                  stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M8 35H2V11H31V35H16" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M31 35V18H39.5714L46 26.5V35H39.8112" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>待收货</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M44 6H4V36H13V41L23 36H44V6Z" fill="none" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M14 19.5V22.5" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 19.5V22.5" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M34 19.5V22.5" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>待评价</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M18 22H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 28H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24.0083 22V34" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M30 15L24 21L18 15" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>退款</span>
                    </div>
                </div>
                <div class="card">
                    <div class="icon-box">
                        <span>¥<strong>3</strong>.15</span>
                        <span>红包</span>
                    </div>
                    <div class="icon-box">
                        <span><strong>3</strong>张</span>
                        <span>优惠券</span>
                    </div>
                    <div class="icon-box">
                        <span>领红包¥<strong>40</strong></span>
                        <span>省钱卡</span>
                    </div>
                    <div class="icon-box">
                        <span>¥<strong>13</strong>.00</span>
                        <span>淘金币</span>
                    </div>
                    <div class="card-label">
                        <span>我的权益</span>
                    </div>
                </div>
                <div class="card user-content-more-server">
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z"
                                  stroke="#333" stroke-width="4"/>
                            <path d="M4 20.8404C7.01485 19.4168 9.24466 19.2185 10.6894 20.2454C12.8566 21.7859 13.1283 28.064 18.0575 25.0635C22.9867 22.063 15.9467 20.8404 17.475 16.4939C19.0033 12.1474 24.0083 15.5237 24.5059 10.7627C24.8375 7.58862 21.0408 6.37413 13.1156 7.11921"
                                  stroke="#333" stroke-width="4"/>
                            <path d="M36.0001 8C30.2857 12.9886 28.2899 16.0011 30.0127 17.0373C32.5968 18.5917 33.6933 16.4033 36.8467 17.0373C40.0001 17.6714 39.3173 21.9457 37.6587 21.9457C36.0001 21.9457 27.41 20.8518 27.8427 25.865C28.2753 30.8781 33.4422 31.6203 33.4422 34.4211C33.4422 36.2883 32.299 39.146 30.0127 42.9942"
                                  stroke="#333" stroke-linecap="round" stroke-width="4"/>
                            <path d="M6.10449 32.9264C7.01598 32.5288 7.70115 32.2374 8.15999 32.052C12.0071 30.4978 14.8617 30.1314 16.7236 30.953C20.0161 32.4059 18.7503 35.3401 19.7816 36.4211C20.8128 37.5021 23.388 37.1876 23.388 39.244C23.388 40.615 22.9275 42.1637 22.0065 43.8901"
                                  stroke="#333" stroke-linecap="round" stroke-width="4"/>
                        </svg>
                        <span>世界</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M40 30V15L27.5 7.96875M20.5 7.96875L8 15V30M11 34.6875L24 42L32 37.5L37 34.6875"
                                  stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M21 18.75L18 20.5V24V27.5L21 29.25L24 31L27 29.25L30 27.5V24V20.5L27 18.75L24 17L21 18.75Z"
                                  fill="none" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 17V10" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M30 27L37 31" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 27L11 31" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <circle cx="24" cy="7" fill="none" r="3" stroke="#333" stroke-linecap="round"
                                    stroke-linejoin="round" stroke-width="4"/>
                            <circle cx="8" cy="33" fill="none" r="3" stroke="#333" stroke-linecap="round"
                                    stroke-linejoin="round" stroke-width="4"/>
                            <circle cx="40" cy="33" fill="none" r="3" stroke="#333" stroke-linecap="round"
                                    stroke-linejoin="round" stroke-width="4"/>
                        </svg>
                        <span>区块链</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M4 19.313V9H44V19.313C41.8815 20.068 40.3636 22.1053 40.3636 24.5C40.3636 26.8947 41.8815 28.932 44 29.687V40H4V29.687C6.11853 28.932 7.63636 26.8947 7.63636 24.5C7.63636 22.1053 6.11853 20.068 4 19.313Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M19 16L24 21L29 16" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 22H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 28.1667H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 22V34" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>优惠券</span>
                    </div>

                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M24 44C32.8366 44 40 37.4876 40 29.4545C40 21.5758 34.6667 13.0909 24 4C13.3333 13.0909 8 21.5758 8 29.4545C8 37.4878 15.1634 44 24 44Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M18.8572 19L24 24.3684L29.1429 19" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M18 26.158H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M18 31.5264H30" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M24 26.158V36.0001" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>水费</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M39 6H9C7.34315 6 6 7.34315 6 9V39C6 40.6569 7.34315 42 9 42H39C40.6569 42 42 40.6569 42 39V9C42 7.34315 40.6569 6 39 6Z"
                                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M13.4398 29.8347L19.0967 24.1778L23.4847 28.5555L34 18.0001" stroke="#333"
                                  stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
                            <path d="M26 18H34V26" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>趋势</span>
                    </div>

                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M31 4H16L10 27H18L14 44L40 16H28L31 4Z" fill="none" stroke="#333"
                                  stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M21 11L19 19" stroke="#333" stroke-linecap="round" stroke-width="4"/>
                        </svg>
                        <span>闪付</span>
                    </div>
                    <div class="icon-box">
                        <?xml version="1.0" encoding="UTF-8"?>
                        <svg fill="none" height="24" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
                            <path d="M41 44V20H7V44H41Z" fill="none" stroke="#333" stroke-linecap="round"
                                  stroke-linejoin="round" stroke-width="4"/>
                            <path d="M24 44V20" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <path d="M41 44H7" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                            <rect fill="none" height="8" stroke="#333" stroke-linejoin="round" stroke-width="4"
                                  width="40" x="4"
                                  y="12"/>
                            <path d="M16 4L24 12L32 4" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                                  stroke-width="4"/>
                        </svg>
                        <span>礼物</span>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
<div class="footer-container">
    <label class="footer-item" for="home" tabindex="0">
        <?xml version="1.0" encoding="UTF-8"?>
        <svg fill="none" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
            <path d="M44 44V20L24 4L4 20L4 44H16V26H32V44H44Z" fill="none" stroke="#333" stroke-linejoin="round"
                  stroke-width="4"/>
            <path d="M24 44V34" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
        </svg>
    </label>
    <label class="footer-item" for="chat" tabindex="2">
        <?xml version="1.0" encoding="UTF-8"?>
        <svg fill="none" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
            <path d="M44.0001 24C44.0001 35.0457 35.0458 44 24.0001 44C18.0266 44 4.00006 44 4.00006 44C4.00006 44 4.00006 29.0722 4.00006 24C4.00006 12.9543 12.9544 4 24.0001 4C35.0458 4 44.0001 12.9543 44.0001 24Z"
                  fill="none" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
            <path d="M14 18L32 18" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
            <path d="M14 26H32" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
            <path d="M14 34H24" stroke="#333" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
        </svg>
    </label>
    <label class="footer-item" for="shopping-car" tabindex="3">
        <?xml version="1.0" encoding="UTF-8"?>
        <svg fill="none" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
            <path d="M39 32H13L8 12H44L39 32Z" fill="none"/>
            <path d="M3 6H6.5L8 12M8 12L13 32H39L44 12H8Z" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                  stroke-width="4"/>
            <circle cx="13" cy="39" r="3" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                    stroke-width="4"/>
            <circle cx="39" cy="39" r="3" stroke="#333" stroke-linecap="round" stroke-linejoin="round"
                    stroke-width="4"/>
        </svg>
    </label>
    <label class="footer-item" for="user" tabindex="4">
        <?xml version="1.0" encoding="UTF-8"?>
        <svg fill="none" viewBox="0 0 48 48" width="24" xmlns="http://www.w3.org/2000/svg">
            <path d="M5.00372 42.2311C5.00372 42.6557 5.35807 42.9999 5.79521 42.9999L42.2023 43C42.6394 43 42.9938 42.6558 42.9938 42.2313V41.3131C43.012 41.0364 43.049 39.6555 42.1388 38.1289C41.5648 37.1663 40.7318 36.3347 39.6628 35.6573C38.3696 34.8378 36.7245 34.244 34.7347 33.8865C34.72 33.8846 33.2446 33.689 31.7331 33.303C29.101 32.6307 28.8709 32.0357 28.8694 32.0299C28.8539 31.9711 28.8315 31.9146 28.8028 31.8615C28.7813 31.7505 28.7281 31.3328 28.8298 30.2136C29.088 27.371 30.6128 25.691 31.838 24.3412C32.2244 23.9155 32.5893 23.5134 32.8704 23.1191C34.0827 21.4181 34.1952 19.4839 34.2003 19.364C34.2003 19.1211 34.1724 18.9214 34.1127 18.7363C33.9937 18.3659 33.7698 18.1351 33.6063 17.9666L33.6052 17.9654C33.564 17.923 33.5251 17.8828 33.4933 17.8459C33.4812 17.8318 33.449 17.7945 33.4783 17.603C33.5859 16.8981 33.6505 16.3079 33.6815 15.7456C33.7367 14.7438 33.7798 13.2456 33.5214 11.7875C33.4895 11.5385 33.4347 11.2755 33.3494 10.9622C33.0764 9.95814 32.6378 9.09971 32.0284 8.39124C31.9236 8.27722 29.3756 5.5928 21.9788 5.04201C20.956 4.96586 19.9449 5.00688 18.9496 5.05775C18.7097 5.06961 18.3812 5.08589 18.0738 5.16554C17.3101 5.36337 17.1063 5.84743 17.0528 6.11834C16.9641 6.56708 17.12 6.91615 17.2231 7.14718L17.2231 7.1472L17.2231 7.14723C17.2381 7.18072 17.2566 7.22213 17.2243 7.32997C17.0526 7.59588 16.7825 7.83561 16.5071 8.06273C16.4275 8.13038 14.5727 9.72968 14.4707 11.8189C14.1957 13.4078 14.2165 15.8834 14.5417 17.5944C14.5606 17.6889 14.5885 17.8288 14.5432 17.9233L14.5432 17.9233C14.1935 18.2367 13.7971 18.5919 13.7981 19.4024C13.8023 19.4839 13.9148 21.4181 15.1272 23.1191C15.408 23.5131 15.7726 23.9149 16.1587 24.3403L16.1596 24.3412L16.1596 24.3413C17.3848 25.6911 18.9095 27.371 19.1678 30.2135C19.2694 31.3327 19.2162 31.7505 19.1947 31.8614C19.166 31.9145 19.1436 31.971 19.1282 32.0298C19.1266 32.0356 18.8974 32.6287 16.2772 33.2996C14.7656 33.6867 13.2775 33.8845 13.2331 33.8909C11.2994 34.2173 9.66438 34.7963 8.37351 35.6115C7.30813 36.2844 6.47354 37.1175 5.89289 38.0877C4.96517 39.6379 4.99025 41.0497 5.00372 41.3074V42.2311Z"
                  fill="none" stroke="#333" stroke-linejoin="round" stroke-width="4"/>
        </svg>
    </label>

</div>
</body>
</html>